<!--
 * @Description:  questionBank -- 智能题库
 * @Author: your name
 * @Date: 2024-02-18
 * @LastEditTime: 2024-02-18
 * @LastEditors: Please set LastEditors
-->

<template>
  <div>
    <div class="container">
      <div class="typeList">
        <!-- <div
          class="item"
          @click="moni"
          v-for="(item, i) in questionBankList"
          :key="i"
        >
          <img src="@/assets/images/mockTest1.png" alt="" />
          <p>{{ item.name }}</p>
        </div> -->

        <div class="item" @click="moni">
          <img src="@/assets/images/mockTest1.png" alt="" />
          <p>模拟机考</p>
        </div>
        <div class="item" @click="shangci">
          <img src="@/assets/images/testWhite1.png" alt="" />
          <p>继续练习</p>
        </div>
        <div class="item" @click="pinggu">
          <img src="@/assets/images/pg1.png" alt="" />
          <p>做题评估</p>
        </div>
        <div class="item" @click="geterr">
          <img src="@/assets/images/errorList1.png" alt="" />
          <p>错题集</p>
        </div>
        <div class="item" @click="getchan">
          <img src="@/assets/images/collectList1.png" alt="" />
          <p>收藏夹</p>
        </div>
      </div>
      <div class="testList">
        <div class="listBox">
          <div class="item" v-for="(it, i) in quExercises" :key="it.id">
            <div class="section flex" @click="childShow(it, i)">
              <div class="left">
                <img src="@/assets/images/testList1.png" alt="" />
                <p>{{ it.title }}</p>
              </div>
              <div class="commonRight">
                <span>{{ it.count }}题</span>
                <span class="correct">
                  {{ Math.round(33.33 * 100) / 100 }}%
                </span>
                <span class="gray">共233</span>
              </div>
            </div>

            <div class="innerChilds" v-if="it.show_child">
              <div
                class="testPaper flex"
                v-for="(items, indexs) in qusetionbankData"
                :key="indexs.id"
              >
                <div class="left">
                  <img src="@/assets/images/tip1.png" alt="" />
                  <p>
                    {{ items.title }}
                  </p>
                </div>
                <div class="commonRight">
                  <span class="testNum">
                    {{ items.yes }}/{{ items.count }}题
                  </span>
                  <span class="correct">
                    {{ items.bfb }}
                  </span>
                  <button
                    @click="Starttest(items.id)"
                    v-if="items.buts[indexs] == 'start'"
                  >
                    开始做题
                  </button>
                  <button v-if="items.buts[1] == 'clear'">删除记录</button>
                  <button
                    class="continue"
                    @click="Starttest(items.id)"
                    v-if="items.buts[0] == 'continue'"
                  >
                    继续做题
                  </button>
                  <!-- <button
                    class="toReport"
                    v-if="items.status == 3"
                    @click="toreport(items.report_id)"
                  >
                    查看报告
                  </button>
                  <button class="toReport" v-if="items.status == 4">
                    未购买
                  </button> -->
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import {
  getQuebankList,
  questionBankExercises,
  getQuestionExercises
} from '@/api/newzhike/questionBank.js'
export default {
  name: 'questionBank',
  data() {
    return {
      bodybum: 0,
      childData: [],
      scid: null,
      questionBankList: [],
      quExercises: [],
      qusetionbankData: []
    }
  },
  created() {
    this.getmyBank()
  },
  mounted() {},
  methods: {
    async getmyBank() {
      let _that = this
      // 我的题库（智课）
      let parnt_p = {
        combo_id: 1
      }
      const { data: data } = await getQuebankList(parnt_p)
      this.questionBankList = data.data.list
      // console.log(data.data.list)

      // 获取题库练习（智课1级）
      let params_l = {
        combo_id: 1,
        page: 1
      }
      const { data: data_l } = await questionBankExercises(params_l)
      // _that.quExercises = data_l.data.list

      if (data_l.data.list && data_l.data.list.length > 0) {
        data_l.data.list.map((ele, index) => {
          if (ele.show_child) {
            ele.show_child = ele.show_child
          } else {
            ele.show_child = false
          }
          _that.quExercises.push(ele)
          return ele
        })
      }
      // console.log(data_l, _that.quExercises)
    },
    Starttest(ids) {
      this.$router.push({ path: 'practice', query: { id: ids } })
    },
    shangci() {
      let _that = this
      _that.$router.push({
        path: 'practice',
        query: {
          cid: _that.scid,
          from: 2,
          // model: 1,
          type: 2
        }
      })
    },
    async childShow(item, i) {
      if (item.show_child == false) {
        // 手风琴模式
        this.quExercises.forEach((el, index) => {
          el.show_child = false
        })
        let params = {
          cid: 2,
          combo_id: 1
        }
        const { data: data_t } = await getQuestionExercises(params)
        this.qusetionbankData = data_t.data.list
        console.log(data_t)
      }

      item.show_child = !item.show_child
    },
    moni() {
      this.$router.push({
        path: 'mockLists',
        query: {}
      })
    },
    pinggu() {
      this.$router.push({
        path: 'testAssessment',
        query: {}
      })
    },
    geterr() {
      this.$router.push({
        path: 'errorLists',
        query: {}
      })
    },
    getchan() {
      this.$router.push({
        path: 'collectLists',
        query: {}
      })
    }
  }
}
</script>

<style lang="scss">
body,
html,
#app {
  background-color: #fff;
}
</style>
<style scoped lang="scss">
@import '@/assets/styles/index.scss';
@import '@/assets/styles/questionBank.scss';
</style>
